<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>文本溢出隐藏</title>
		<style type="text/css">
			div {
				width: 300px;
			/* 	text-overflow: ellipsis;
				white-space: nowrap;
				/* 不换行 */
				/* wrap换行 */
				/* overflow: hidden; */
				/* 溢出隐藏 */
				/* background-color: #00FFFF; */
				/* 设置显示行数 */
				
				
				/* 多行文本溢出隐藏 */
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 3;
				overflow: hidden;
			}
		</style>
	</head>
	<body>
		<div id="">
			马路旁边是-块大平地，平地上是绿油油的树，树的形状很是好看，树干笔直的挺立着,
			远远望去像一条加粗的直线。 树的顶头是绿色的树叶,树身也有几从小树叶，可爱极了。树叶
			被风吹得飘飘荡荡，像是在随风起舞。不过可别小看这些树木，其中可有大大的人生哲理呢。
			树木密密麻麻的，前面的是笔直的挺立着的树，可后面几排不是很好了,整个树木都歪斜下来
			了，像驼背的老人，又像社会中- -怔不起的青年。相反的是有些树木是社会中的成功者,树枝
			向上发展，像是用自己的手撑起- -片天。
		</div>
	</body>
</html>
